<template>
    <div id="statis-detail">
        <el-breadcrumb class="common-bread">
            <el-breadcrumb-item>体测统计详情</el-breadcrumb-item>
            <span class="phy-standard fr" @click="checkStandard()">体测标准</span>
        </el-breadcrumb>
        <div class="select-head">

            <div class="select-head-top">
                <span class="select-head-title">体测和项目筛选：</span>
                <el-select v-model="physicalId">
                    <el-option v-for='item in physicalList' :label='item.physicalName' :value='item.physicalId' :key="item.physicalId">
                    </el-option>
                </el-select>
                <el-select v-model="testNameType" placeholder="请选择项目">
                    <!-- <el-option label="请选择项目" value='-1'></el-option> -->
                    <el-option v-for='item in testTypeList' :label='item.testName' :value='item.testNameType' :key="item.testNameType"></el-option>
                </el-select>
            </div>

            <div class="select-head-bot">
                <span class="select-head-title">人群筛选：</span>
                <el-select v-if="user.userType < 2" v-model="schoolCode" filterable clearable placeholder="请选择学校">
                    <el-option label="全部学校" value='-1'></el-option>
                    <el-option v-for='item in schoolList' :label='item.schoolName' :value='item.schoolCode' :key="item.physicalId"></el-option>
                </el-select>
                <el-select v-model="grade" placeholder="请选择年级">
                    <el-option label="全部年级" value='-1'></el-option>
                    <el-option v-for='item in gradeList' :label='item.gradeName' :value='item.grade' :key="item.grade"></el-option>
                </el-select>
                <el-select v-if="user.userType >= 2" v-model="classCode" placeholder="请选择班级">
                    <el-option label="全部班级" value='-1'></el-option>
                    <el-option v-for='item in classes' :label='item.className' :value='item.classCode' :key="item.classCode"></el-option>
                </el-select>
                <el-select v-model="gender" placeholder="请选择性别">
                    <el-option label="所有性别" value='-1'></el-option>
                    <el-option label="男生" value='1'></el-option>
                    <el-option label="女生" value='0'></el-option>
                </el-select>

                <el-button type="primary" @click="getPhysicalDetailInfo()">搜索</el-button>
            </div>
        </div>

        <div class="contentBox">
            <div class="list" v-show="hasTotalData || hasTrendArr">
                <div class="total-data fl" v-show="hasTotalData">
                    <div class="total-data-title">{{totalScoreTitle}}</div>
                    <vue-highcharts :options="total_option" ref="pieChart_total" style="height: 360px;padding: 20px 20px 0px;"></vue-highcharts>
                    <!-- <div class="nodata1">无数据</div> -->
                </div>
                <div class="everyone-data fr" v-show="hasTrendArr">
                    <div class="total-data-title">
                        <span>{{regionOrPersonal}}</span>
                        <el-checkbox-group v-model="trendCheckList" :min="1" style="display:inline-block;margin-left:60px;">
                            <el-checkbox class="check-item1" label="优秀率" style="color:#FFC12B"></el-checkbox>
                            <el-checkbox class="check-item2" label="良好率" style="color:#0398FF"></el-checkbox>
                            <el-checkbox class="check-item3" label="及格率" style="color:#86C88E"></el-checkbox>
                            <el-checkbox class="check-item4" label="不及格率" style="color:#FF5151"></el-checkbox>
                        </el-checkbox-group>
                    </div>
                    <vue-highcharts :options="history_option" ref="pieChart_history" style="height: 360px;padding: 20px 20px 0px;"></vue-highcharts>
                </div>
            </div>

            <div class="list" v-show="hasSchoolGradeClassArr">
                <div class="achievement">
                    <div class="achievement-title">
                        <span>成绩统计</span>
                        <el-checkbox-group v-model="sgcCheckList" :min="1" style="display:inline-block;margin-left:60px;">
                            <el-checkbox class="check-item1" label="优秀率" style="color:#FFC12B"></el-checkbox>
                            <el-checkbox class="check-item2" label="良好率" style="color:#0398FF"></el-checkbox>
                            <el-checkbox class="check-item3" label="及格率" style="color:#86C88E"></el-checkbox>
                            <el-checkbox class="check-item4" label="不及格率" style="color:#FF5151"></el-checkbox>
                        </el-checkbox-group>
                    </div>
                    <vue-highcharts :options="score_option" ref="pieChart_score" style="height: 360px;padding: 20px 20px 0px;"></vue-highcharts>
                </div>
            </div>
            <!-- 性别维度 -->
            <div class="list" v-show="hasGenderArr">
                <div class="genderda">
                    <div class="genderda-title">
                        <span>成绩统计</span>
                    </div>
                    <vue-highcharts :options="gender_option" ref="pieChart_gender" style="height: 360px;padding: 20px 20px 0px;"></vue-highcharts>
                </div>
            </div>

            <div class="list" v-show="hassportArr">
                <div class="sport">
                    <div class="sport-title">
                        <span>项目成绩统计</span>
                        <el-checkbox-group v-model="sportCheckList" :min="1" style="display:inline-block;margin-left:60px;">
                            <el-checkbox class="check-item1" label="优秀率" style="color:#FFC12B"></el-checkbox>
                            <el-checkbox class="check-item2" label="良好率" style="color:#0398FF"></el-checkbox>
                            <el-checkbox class="check-item3" label="及格率" style="color:#86C88E"></el-checkbox>
                            <el-checkbox class="check-item4" label="不及格率" style="color:#FF5151"></el-checkbox>
                        </el-checkbox-group>
                    </div>
                    <vue-highcharts :options="sport_option" ref="pieChart_sport" style="height: 360px;padding: 20px 20px 0px;"></vue-highcharts>
                </div>
            </div>

            <div class="nodata" v-if="isNoData">
                <img src="../../../assets/noData.png">
                <p>暂无数据</p>
            </div>
        </div>
    </div>
</template>
<script>
    import { mapState, mapActions } from "vuex";

    export default {
        data() {
            return {
                hasTotalData: true, // 
                hasGenderArr: true,
                isNoData: true, // 默认没有数据
                firstRequest: 1,
                totalScoreTitle: '',
                schoolCode: '-1',
                grade: '-1',
                classCode: '-1',
                physicalId: '',
                gender: '-1',
                testNameType: '',
                schoolList: [],
                gradeList: [],
                classes: [],
                physicalList: [],
                testTypeList: [],
                textNameFormat: new Map([
                    [0, '总成绩'],
                    [1, 'BMI'],
                    [2, '肺活量'],
                    [3, '50米跑'],
                    [4, '立定跳远'],
                    [5, '坐位体前屈'],
                    [6, '一分钟仰卧起坐'],
                    [7, '引体向上'],
                    [8, '1000米跑'],
                    [9, '800米跑'],
                    [12, '8*50米往返跑'],
                    [13, '一分钟跳绳']
                ]),
                // 图形各等级颜色
                exclentColor: '#ff9c17',
                goodColor: '#69C0FF',
                passColor: '#86C88E',
                nopassColor: '#FF7875',
                borderRadius: 10,
                pointWidth: 20,
                // 学校，年级，班级数据项
                hasSchoolGradeClassArr: true,
                sgcCheckList: ['优秀率', '及格率'],
                // 项目数据项
                hassportArr: true,
                sportCheckList: ['优秀率', '及格率'],
                // 趋势数据项
                hasTrendArr: true,
                trendCheckList: ['优秀率', '及格率'],

                regionOrPersonal: '历届学生成绩趋势',
                total_option: {
                    chart: {
                        plotBackgroundColor: null, plotBorderWidth: null, plotShadow: false,
                        type: 'column'  // 图形类型
                    },
                    title: { text: '', },
                    credits: { enabled: false },
                    xAxis: { categories: [/** 横坐标名称 */], },
                    yAxis: {
                        gridLineWidth: 0, title: null, showLastLabel: false,
                        tickPositions: [0, 25, 50, 75, 100, 120]
                    },
                    colorByPoint: true,
                    plotOptions: {
                        column: {
                            shadow: false,
                            dataLabels: { enabled: true, allowOverlap: true }
                        },
                        series: {
                            borderWidth: 0,
                            dataLabels: {
                                enabled: true,
                                format: '<span style="color:{point.color};">{point.y:.1f}%</span>',
                                useHTML: true
                            }
                        }
                    },
                    tooltip: { headerFormat: "", pointFormat: "共 {point.per} 人" },
                    series: [/**数据 */],
                    legend: { enabled: false }
                },
                history_option: {
                    chart: {
                        plotBackgroundColor: null, plotBorderWidth: null, plotShadow: false,
                        // type: 'column'  // 图形类型
                    },
                    title: { text: '', },
                    credits: { enabled: false },
                    xAxis: { categories: [/** 横坐标名称 */], },
                    yAxis: {
                        gridLineWidth: 0, title: null, showLastLabel: false,
                        tickPositions: [0, 25, 50, 75, 100, 120]
                    },
                    colorByPoint: true,
                    plotOptions: {
                        line: {
                            shadow: false,
                            enableMouseTracking: false,
                            dataLabels: { enabled: true, allowOverlap: true }
                        },
                        series: {
                            borderWidth: 0,
                            dataLabels: {
                                enabled: true,
                                format: '<span style="color:{point.color};">{point.y:.1f}%</span>',
                                useHTML: true
                            }
                        }
                    },
                    tooltip: { headerFormat: "", pointFormat: "共 {point.per} 人" },
                    series: [/**数据 */],
                    legend: { enabled: false }
                },
                score_option: {
                    chart: {
                        width: 900,
                        plotBackgroundColor: null, plotBorderWidth: null, plotShadow: false,
                        type: 'column'  // 图形类型
                    },
                    title: { text: '', },
                    credits: { enabled: false },
                    xAxis: { categories: [/** 横坐标名称 */], },
                    yAxis: {
                        gridLineWidth: 0, title: null, showLastLabel: false,
                        tickPositions: [0, 25, 50, 75, 100, 120]
                    },
                    colorByPoint: true,
                    plotOptions: {
                        column: {
                            shadow: false,
                            dataLabels: { enabled: true, allowOverlap: true }
                        },
                        series: {
                            borderWidth: 0,
                            dataLabels: {
                                enabled: true,
                                format: '<span style="color:{point.color};">{point.y:.1f}%</span>',
                                useHTML: true
                            }
                        }
                    },
                    tooltip: { headerFormat: "", pointFormat: "共 {point.per} 人" },
                    series: [/**数据 */],
                    legend: { enabled: false }
                },

                sport_option: {
                    chart: {
                        // width:500,
                        plotBackgroundColor: null, plotBorderWidth: null, plotShadow: false,
                        type: 'column'  // 图形类型
                    },
                    title: { text: '', },
                    credits: { enabled: false },
                    xAxis: { categories: [/** 横坐标名称 */], },
                    yAxis: {
                        gridLineWidth: 0, title: null, showLastLabel: false,
                        tickPositions: [0, 25, 50, 75, 100, 120]
                    },
                    colorByPoint: true,
                    plotOptions: {
                        column: {
                            shadow: false,
                            dataLabels: { enabled: true, allowOverlap: true },
                            groupPadding: 0.1
                        },
                        series: {
                            borderWidth: 0,
                            dataLabels: {
                                enabled: true,
                                format: '<span style="color:{point.color};">{point.y:.1f}%</span>',
                                useHTML: true
                            }
                        }
                    },
                    tooltip: { headerFormat: "", pointFormat: "共 {point.per} 人" },
                    series: [/**数据 */],
                    legend: { enabled: false }
                },
                gender_option: {
                    chart: {
                        plotBackgroundColor: null, plotBorderWidth: null, plotShadow: false,
                        type: 'column'  // 图形类型
                    },
                    title: { text: '', },
                    credits: { enabled: false },
                    xAxis: { categories: [/** 横坐标名称 */], },
                    yAxis: {
                        gridLineWidth: 0, title: null, showLastLabel: false,
                        tickPositions: [0, 25, 50, 75, 100, 120]
                    },
                    colorByPoint: true,
                    plotOptions: {
                        column: {
                            shadow: false,
                            dataLabels: { enabled: true, allowOverlap: true }
                        },
                        series: {
                            borderWidth: 0,
                            dataLabels: {
                                enabled: true,
                                format: '<span style="color:{point.color};">{point.y:.1f}%</span>',
                                useHTML: true
                            },
                            events: { legendItemClick: function () { return false } }
                        }
                    },
                    tooltip: { headerFormat: "", pointFormat: "共 {point.per} 人" },
                    series: [/**数据 */],
                    legend: { enabled: true },
                },
            }
        },
        watch: {
            trendCheckList(cur, pre) {
                if (cur.length > pre.length) {
                    // 增加
                    cur.forEach(item => {
                        if (pre.indexOf(item) < 0) {
                            this.addMySeries(item, this.$refs.pieChart_history)
                        }
                    })
                } else {
                    // 减少
                    pre.forEach(item => {
                        if (cur.indexOf(item) < 0) {
                            this.removeMySeries(item, this.$refs.pieChart_history)
                        }
                    })
                }
            },
            sgcCheckList(cur, pre) {
                if (cur.length > pre.length) {
                    // 增加
                    cur.forEach(item => {
                        if (pre.indexOf(item) < 0) {
                            this.addMySeries(item, this.$refs.pieChart_score)
                        }
                    })
                } else {
                    // 减少
                    pre.forEach(item => {
                        if (cur.indexOf(item) < 0) {
                            this.removeMySeries(item, this.$refs.pieChart_score)
                        }
                    })
                }
            },
            sportCheckList(cur, pre) {
                if (cur.length > pre.length) {
                    // 增加
                    cur.forEach(item => {
                        if (pre.indexOf(item) < 0) {
                            this.addMySeries(item, this.$refs.pieChart_sport)
                        }
                    })
                } else {
                    // 减少
                    pre.forEach(item => {
                        if (cur.indexOf(item) < 0) {
                            this.removeMySeries(item, this.$refs.pieChart_sport)
                        }
                    })
                }
            },
            // 体测变，其他所有都变
            physicalId() {
                this.getPhysicalItemList();
                this.getPhysicalItemTopList(this.firstRequest);
                this.firstRequest += 1;
                // 重置其他所有筛选条件
                this.schoolCode = '-1';
                this.grade = '-1';
                this.gender = '-1';
                this.classCode = '-1';
            },
            // 学校变
            schoolCode() {
                this.getPhysicalItemList();
            },
            grade() {
                this.getPhysicalItemList();
            },
            classCode() {
                this.getPhysicalItemList();
            }
        },
        mounted() {
            this.getPhysicalList();
            // this.noPhysicalData();

        },

        computed: mapState({ user: state => state.user }),
        methods: {
            addMySeries(name, pieChart_pro) {
                let data = pieChart_pro.getChart();
                data.series.forEach(item => {
                    if (item.name == name) {
                        return item.show();
                    }
                })
            },

            removeMySeries(name, pieChart_pro) {
                let data = pieChart_pro.getChart();
                data.series.forEach(item => {
                    if (item.name == name) {
                        return item.hide();
                    }
                })
            },

            noPhysicalData() {
                this.hassportArr = false;
                this.hasSchoolGradeClassArr = false;
                this.hasTotalData = false;
                this.hasTrendArr = false;
                this.hasGenderArr = false;
                this.isNoData = true;
            },
            hasPhysicalData() {
                this.hassportArr = true;
                this.hasSchoolGradeClassArr = true;
                this.hasTotalData = true;
                this.hasTrendArr = true;
                this.hasGenderArr = true;
                this.isNoData = false;
            },
            // 获取体测列表（筛选条件）
            getPhysicalList() {
                this.physicalList = [];
                this.$axios.post('/jlp/physical/tools/allPhysicals', {
                }).then(res => {
                    if (res.data.error == 10000) {
                        let arrData = res.data.data;
                        if (arrData && arrData.length) {
                            arrData.forEach(item => {
                                this.physicalList.push({
                                    physicalId: item.physicalId + '',
                                    physicalName: item.physicalName
                                })
                            })
                            this.physicalId = this.physicalList[0].physicalId;

                        } else {
                            this.noPhysicalData();
                        }
                    } else {
                        this.noPhysicalData();
                    }
                }).catch((err) => {
                    this.noPhysicalData();
                })
            },
            getPhysicalItemTopList(firstRequest) {
                this.testTypeList = [];
                this.$axios.post('/jlp/physical/statisticDetail/chooseType', {
                    physicalId: this.physicalId * 1,
                }).then(response => {
                    if (response.data.error == 10000) {
                        let prodata = response.data.data.testNameTypes
                        if (prodata && prodata.length > 0) {
                            prodata.forEach(ele => {
                                this.testTypeList.push({
                                    testNameType: ele,
                                    testName: this.textNameFormat.get(ele)
                                })
                            })

                            if (!prodata.includes(0)) {
                                this.testTypeList.unshift({
                                    testNameType: '-1',
                                    testName: '请选择项目'
                                })
                            }
                        } else {
                            this.testTypeList = [{ testNameType: '-1', testName: '请选择项目' }];
                        }
                    } else {
                        this.testTypeList = [{ testNameType: '-1', testName: '请选择项目' }];
                    }
                    this.testNameType = this.testTypeList[0].testNameType;
                    if (firstRequest == 1) {
                        // 第一次进页面的请求
                        if (this.testNameType != '-1') {
                            this.getPhysicalDetailInfo();
                        } else {
                            this.noPhysicalData();
                        }
                    }
                }).catch(err => {
                    this.testTypeList = [{ testNameType: '-1', testName: '请选择项目' }];
                    this.testNameType = '-1'
                    if (firstRequest == 1) {
                        // 第一次进页面的请求
                        if (this.testNameType != '-1') {
                            this.getPhysicalDetailInfo();
                        } else {
                            this.noPhysicalData();
                        }
                    }
                })
            },
            // 获取体测其他筛选列表（筛选条件下）
            getPhysicalItemList() {

                this.schoolList = [];
                this.classes = [];
                this.gradeList = [];
                this.$axios.post('/jlp/physical/statisticDetail/choose', {
                    physicalId: this.physicalId * 1,
                    schoolCode: this.schoolCode,
                    grade: this.grade * 1,
                    gender: this.gender * 1,
                    classCode: this.classCode
                }).then(res => {
                    if (res.data.error == 10000) {
                        let prodata = res.data.data;
                        if (prodata) {

                            // 年级列表整理
                            if (prodata.grades && prodata.grades.length) {
                                prodata.grades.forEach(ele => {
                                    this.gradeList.push({
                                        grade: ele,
                                        gradeName: this.$util.gradeFormat(ele)
                                    })
                                })
                            }
                            this.schoolList = prodata.schools;
                            this.classes = prodata.classes;
                        }
                    }
                })
            },

            // 0,1权限
            getPhysicalDetailInfo() {
                if (this.testNameType == '-1') {
                    this.noPhysicalData();
                    return this.$util.errorMsg('请先选择项目')
                }
                this.hasPhysicalData();
                this.sgcCheckList = ['优秀率', '及格率'];
                this.sportCheckList = ['优秀率', '及格率'];
                this.trendCheckList = ['优秀率', '及格率'];
                this.$axios.post('/jlp/physical/statisticDetail/total', {
                    physicalId: this.physicalId * 1,
                    testNameType: this.testNameType * 1,
                    schoolCode: this.schoolCode ? this.schoolCode : -1,
                    grade: this.grade * 1,
                    gender: this.gender * 1,
                    classCode: this.classCode
                }).then(res => {
                    if (res.data.error == 10000) {

                        let proData = res.data.data;

                        if (proData) {
                            // 总数据
                            let totalCheckedData = this.checkTotalData(proData.choosePhysicals);
                            if (totalCheckedData.length) {
                                this.isNoData = false;
                                if (this.testNameType <= 0) {
                                    this.totalScoreTitle = '总体成绩'
                                } else {
                                    this.totalScoreTitle = this.textNameFormat.get(this.testNameType * 1) + '成绩'
                                }

                                let pieChart_total = this.$refs.pieChart_total;
                                pieChart_total.removeSeries();

                                pieChart_total.getChart().xAxis[0].update({
                                    categories: ['优秀率', '良好率', '及格率', '不及格率']
                                });

                                pieChart_total.addSeries({
                                    data: totalCheckedData,
                                    borderRadius: 10,
                                    pointWidth: 20
                                });
                            } else {
                                this.hasTotalData = false;
                            }
                            // 历史趋势
                            if (proData.historyPhysicals && proData.historyPhysicals.length > 1) {
                                this.isNoData = false;
                                let pieChart_history = this.$refs.pieChart_history; // 历史趋势
                                pieChart_history.removeSeries();

                                let drawObj = this.newDrawList(proData.historyPhysicals);
                                pieChart_history.getChart().xAxis[0].update({
                                    allowDecimals: false,
                                    categories: drawObj.xcateName
                                });
                                pieChart_history.addSeries(
                                    { color: this.exclentColor, name: '优秀率', data: drawObj.exclentArr, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                                pieChart_history.addSeries(
                                    { color: this.goodColor, name: '良好率', data: drawObj.goodArr, visible: false, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                                pieChart_history.addSeries(
                                    { color: this.passColor, name: '及格率', data: drawObj.passArr, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                                pieChart_history.addSeries(
                                    { color: this.nopassColor, name: '不及格率', data: drawObj.nopassArr, visible: false, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                            } else {
                                this.hasTrendArr = false;
                            }

                            // 项目（下面部分）
                            if (this.testNameType * 1 < 1 && proData.testNameTypes && proData.testNameTypes.length) {
                                this.isNoData = false;
                                let pieChart_sport = this.$refs.pieChart_sport; // 项目
                                pieChart_sport.removeSeries();

                                let drawObj = this.newDrawList(proData.testNameTypes);

                                pieChart_sport.getChart().xAxis[0].update({
                                    categories: drawObj.xcateName
                                });
                                pieChart_sport.addSeries(
                                    { color: this.exclentColor, name: '优秀率', data: drawObj.exclentArr, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                                pieChart_sport.addSeries(
                                    { color: this.goodColor, name: '良好率', data: drawObj.goodArr, visible: false, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                                pieChart_sport.addSeries(
                                    { color: this.passColor, name: '及格率', data: drawObj.passArr, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                                pieChart_sport.addSeries(
                                    { color: this.nopassColor, name: '不及格率', data: drawObj.nopassArr, visible: false, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                            } else {
                                this.hassportArr = false;
                            }

                            let successData = false;
                            let userfulArr = []
                            // 学校维度 
                            if (proData.schools && proData.schools.length && !successData) {
                                successData = true;
                                this.isNoData = false;
                                userfulArr = proData.schools;
                            }
                            // 年级维度
                            if (proData.grades && proData.grades.length && !successData) {
                                successData = true;
                                this.isNoData = false;
                                userfulArr = proData.grades;
                            }
                            // 班级维度 
                            if (proData.classes && proData.classes.length && !successData) {
                                successData = true;
                                this.isNoData = false;
                                userfulArr = proData.classes;
                            }
                            // 性别维度
                            if (proData.gender && proData.gender.length && !successData) {
                                this.isNoData = false;
                                let pieChart_gender = this.$refs.pieChart_gender; // 项目
                                pieChart_gender.removeSeries();
                                let gendenFormatData = this.checkGenderData(proData.gender);
                                pieChart_gender.getChart().xAxis[0].update({
                                    categories: ['优秀率', '良好率', '及格率', '不及格率']
                                });
                                pieChart_gender.addSeries(
                                    { color: this.exclentColor, name: '男生', data: gendenFormatData.maleArr, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                )
                                pieChart_gender.addSeries(
                                    { color: this.passColor, name: '女生', data: gendenFormatData.femaleArr, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                )
                            } else {
                                this.hasGenderArr = false;
                            }

                            if (successData) {
                                this.isNoData = false;
                                let pieChart_score = this.$refs.pieChart_score; // 成绩
                                pieChart_score.removeSeries();
                                let drawObj = this.newDrawList(userfulArr);

                                pieChart_score.getChart().xAxis[0].update({
                                    allowDecimals: false,
                                    categories: drawObj.xcateName
                                });
                                pieChart_score.addSeries(
                                    { color: this.exclentColor, name: '优秀率', data: drawObj.exclentArr, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                                pieChart_score.addSeries(
                                    { color: this.goodColor, name: '良好率', data: drawObj.goodArr, visible: false, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                                pieChart_score.addSeries(
                                    { color: this.passColor, name: '及格率', data: drawObj.passArr, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                                pieChart_score.addSeries(
                                    { color: this.nopassColor, name: '不及格率', data: drawObj.nopassArr, visible: false, borderRadius: (this.pointWidth / 2), maxPointWidth: this.pointWidth }
                                );
                            } else {
                                this.hasSchoolGradeClassArr = false;
                            }

                            // 0,1权限下，选了年级和性别则中间部分不显示；2,3权限下，选了班级和性别则中间部分不显示
                            if (
                                ([0, 1].includes(this.user.userType) && this.grade * 1 > -1 && this.gender * 1 > -1) ||
                                ([2, 3].includes(this.user.userType) && this.classCode * 1 > -1 && this.gender * 1 > -1)
                            ) {

                                this.hasGenderArr = false;
                                this.hasSchoolGradeClassArr = false;
                            }


                        }
                    } else {
                        this.noPhysicalData();
                    }
                }).catch((err) => {
                    this.noPhysicalData();
                })
            },

            // 中间以及下面的图形的处理方法
            newDrawList(handleArr) {
                let exclentArr = [],
                    goodArr = [],
                    passArr = [],
                    nopassArr = [],
                    xcateName = [];
                handleArr.forEach(item => {
                    let proName = '',
                        exclent = item.exclent * 1,
                        good = item.good * 1 + exclent,
                        pass = item.pass * 1 + good,
                        nopass = item.nopass * 1;
                    exclentArr.push({ y: (pass + nopass) > 0 ? ((exclent / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: exclent });
                    goodArr.push({ y: (pass + nopass) > 0 ? ((good / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: good });
                    passArr.push({ y: (pass + nopass) > 0 ? ((pass / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: pass });
                    nopassArr.push({ y: (pass + nopass) > 0 ? ((nopass / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: nopass });

                    for (let i in item) {
                        // name重新整理
                        if (i.indexOf('Name') > -1) {
                            proName = item[i]
                        }
                        // 年级整理
                        if (i.indexOf('grade') > -1) {
                            proName = this.$util.gradeFormat(item[i])
                        }
                        // 项目整理
                        if (i.indexOf('testType') > -1) {
                            proName = this.textNameFormat.get(item[i]);
                        }
                    };
                    xcateName.push(proName);
                })
                return {
                    exclentArr,
                    goodArr,
                    passArr,
                    nopassArr,
                    xcateName
                }
            },
            // 体测标准
            checkStandard() {
                location.href = '/#/physicalStandard'
            },
            // 总数据验证方法
            checkTotalData(choosePhysicals) {
                this.maleTotalCount = choosePhysicals.maleTotalCount;
                this.femaleTotalCount = choosePhysicals.femaleTotalCount;
                this.schoolTotalCount = choosePhysicals.schoolTotalCount;
                this.physicalName = choosePhysicals.physicalName;
                // 总数据
                let exclent = choosePhysicals.exclent * 1;
                let good = choosePhysicals.good * 1 + exclent;
                let pass = choosePhysicals.pass * 1 + good;
                let nopass = choosePhysicals.nopass * 1;
                let tdata = [];
                if (pass + nopass > 0) {
                    tdata = [
                        { name: '优秀率', color: this.exclentColor, y: ((exclent / (pass + nopass)) * 100).toFixed(2) * 1, per: exclent },
                        { name: '良好率', color: this.goodColor, y: ((good / (pass + nopass)) * 100).toFixed(2) * 1, per: good },
                        { name: '及格率', color: this.passColor, y: ((pass / (pass + nopass)) * 100).toFixed(2) * 1, per: pass },
                        { name: '不及格率', color: this.nopassColor, y: ((nopass / (pass + nopass)) * 100).toFixed(2) * 1, per: nopass },
                    ]
                }
                return tdata;
            },
            // 中间数据验证
            checkCenterScoreData() {
                // 学校维度 this.user.userType < 2 && this.schoolCode == '-1' && 
                // 年级维度 this.grade == '-1' && ((this.user.userType < 2 && this.schoolCode != '-1') || this.user.userType == 2) &&
                // 班级维度 this.classCode == '-1' && ((this.user.userType == 2 && this.grade != '-1') || this.user.userType == 3) &&
                // 性别维度(this.user.userType < 2 && this.schoolCode != '-1' && this.grade != '-1') ||
                // (this.user.userType == 2 && this.grade != '-1' && this.classCode != '-1') ||
                // (this.user.userType == 3 && this.classCode != '-1')
            },
            // 性别数据验证
            checkGenderData(proData) {
                let maleArr = [], femaleArr = [];
                proData.forEach(item => {
                    let exclent = item.exclent * 1;
                    let good = item.good * 1 + exclent;
                    let pass = item.pass * 1 + good;
                    let nopass = item.nopass * 1;
                    if (item.gender == 1) {
                        maleArr = [
                            { y: (pass + nopass) > 0 ? ((exclent / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: exclent },
                            { y: (pass + nopass) > 0 ? ((good / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: good },
                            { y: (pass + nopass) > 0 ? ((pass / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: pass },
                            { y: (pass + nopass) > 0 ? ((nopass / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: nopass }
                        ]
                    } else {
                        femaleArr = [
                            { y: (pass + nopass) > 0 ? ((exclent / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: exclent },
                            { y: (pass + nopass) > 0 ? ((good / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: good },
                            { y: (pass + nopass) > 0 ? ((pass / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: pass },
                            { y: (pass + nopass) > 0 ? ((nopass / (pass + nopass)) * 100).toFixed(2) * 1 : 0, per: nopass }
                        ]
                    }
                })

                return {
                    maleArr, femaleArr
                }

            },
        }
    }
</script>
<style>
    #statis-detail .select-head {
        min-width: 1060px;
        background-color: #fff;
        padding: 20px 24px 10px;
        margin-left: 32px;
        margin-right: 32px;
    }

    .nodata {
        text-align: center;
        padding-top: 100px;
    }

    .nodata p {
        color: #666;
        font-size: 20px;
        line-height: 80px;
    }

    .select-head-top {
        margin-bottom: 10px;
    }

    .select-head-title {
        display: inline-block;
        width: 130px;
        text-align: right;
    }

    #statis-detail .contentBox {
        min-width: 1060px;
    }

    #statis-detail .list {
        overflow: hidden;
        margin-bottom: 20px;
    }

    #statis-detail .total-data {
        width: 400px;
        margin-right: 40px;
        background-color: #fff;
    }

    .achievement,
    .genderda,
    .sport {
        width: 100%;
    }

    /* checkBox */
    #statis-detail .check-item1 .el-checkbox__input.is-checked+.el-checkbox__label {
        color: #FFC12B;
    }

    #statis-detail .check-item2 .el-checkbox__input.is-checked+.el-checkbox__label {
        color: #0398FF;
    }

    #statis-detail .check-item3 .el-checkbox__input.is-checked+.el-checkbox__label {
        color: #86C88E;
    }

    #statis-detail .check-item4 .el-checkbox__input.is-checked+.el-checkbox__label {
        color: #FF5151;
    }

    #statis-detail .everyone-data {
        width: calc(100% - 440px);
    }
</style>